//会员订单管理

import React, { useEffect, useState } from 'react';
import { gethuiyuandingdan } from '../..//utils/api';
import { huiyuandingdan } from '../../utils/types/home';
import Toptitle from '../../Compon/Toptitle';
import Tbale from '../ContentManagement/content_components/Tbale';
import { Tag, Space } from 'antd';
import moment from 'moment';
import UploadFile from '../../Compon/UploadFile';
import Gooutfile from '../../Compon/file/Gooutfile.jsx';
export default function MemberOrder() {
  useEffect(() => {
    getHuiyuandingdan();
  }, []);
  const [huiyuandingdan, setHuiyuandingdan] = useState<huiyuandingdan[]>([]);
  const getHuiyuandingdan = async () => {
    const res = await gethuiyuandingdan();
    setHuiyuandingdan(res.data.data);
    console.log(res.data);
  };
  const columns = [
    {
      title: '序号',
      dataIndex: 'seq',
      key: 'seq',
      render: (text, record, index) => index + 1,
    },

    {
      title: 'ID',
      dataIndex: 'huiyuan_ID',
      key: 'huiyuan_ID',
      width: '1%',
    },
    {
      title: '订单号',
      dataIndex: '_id',
      key: '_id',
    },
    {
      title: '购买内容',
      dataIndex: 'huiyuna_buy_con',
      key: 'huiyuna_buy_con',
    },
    {
      title: '订单金额',
      dataIndex: 'huiyuan_buy_money',
      key: 'huiyuan_buy_money',
      render: (text) => <span>{text}元</span>,
    },
    {
      title: '订单状态',
      dataIndex: 'huiyuan_state',
      key: 'huiyuan_state',
      render: (text) => (
        <Tag color={text === 0 ? 'red' : 'green'}>
          {text === 0 ? '待审核' : '已通过'}
        </Tag>
      ),
      filters: [
        {
          text: '待审核',
          value: 0,
        },
        {
          text: '已通过',
          value: 1,
        },
      ],
      onFilter: (value, record) => {
        return record.huiyuan_state.toString() === value.toString();
      },
    },
    {
      title: '用户名',
      dataIndex: 'huiyuan_id',
      key: 'huiyuan_id',
      render: (text) => <span>{text.name}</span>,
    },
    {
      title: '头像',
      dataIndex: 'huiyuan_id',
      key: 'huiyuan_id',
      render: (text) => (
        <img
          src={text.image}
          alt=""
          style={{ width: '0.4rem', height: '0.4rem' }}
        />
      ),
    },
    {
      title: '手机号',
      dataIndex: '',
      key: 'huiyuan_id',
      render: (text) => <div>{text.tel}</div>,
    },
    {
      title: '交易时间',
      dataIndex: 'huiyuan_id',
      key: 'huiyuan_id',
      render: (text) => <div>{moment(text).format('YYYY-MM-DD HH:mm:ss')}</div>,
    },
    {
      title: '操作',
      key: 'action',
      render: (text, record) => (
        <Space size="middle">
          <span style={{ color: '#1890ff', cursor: 'pointer' }}>详情</span>
          {/* <a onClick={() => deleteHuiyuan(record._id)}>删除</a> */}
        </Space>
      ),
    },
  ];
 
  return (
    <div>
      <Toptitle title="会员订单管理"></Toptitle>
      <Tbale data={huiyuandingdan} colums={columns}></Tbale>
      <div style={{ display: 'flex', justifyContent: 'left' }}>
        <UploadFile
          name={'导入'}
          // url="http://localhost:3000/CustomerService/index/uploadFile"
        ></UploadFile>
        <Gooutfile data={huiyuandingdan}></Gooutfile>
      </div>
    </div>
  );
}
